
<!DOCTYPE HTML>
<html lang="en">
<head>
  <meta charset='UTF-8' />
<meta name='generator' content='ecos.b2c' />
<title>会员注册</title>
<meta name='keywords' content='' />
<meta name='description' content='' />
<meta name='viewport' content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no'/>
  <script src="__PUBLIC__/hytn/js/jquery-1.9.1.min.js"></script>
  <script src="__PUBLIC__/layer/layer.js"></script>
  <script src="__PUBLIC__/hytn/js/jquery.form.min.js" type="text/javascript"></script>
  <script src="__PUBLIC__/shop.js"></script>
    <link href="__PUBLIC__/phone/css/zhuce_style.css" rel="stylesheet" media="screen, projection" />
    <script src="__PUBLIC__/phone/js/shop.min.js"></script>
</head>
<body style="background-color: #F7F7F8;">
<style type="text/css">
.c-g{
  border-radius: 5px;
  background-color: white;
  width: 45%;
  float: left;
}
  .k{
    background-color: white;
    /*text-align: center;*/
  }

.k input{
  margin-left: 10px;
}
</style>
<div class="full-screen">
  <header style="background-image: linear-gradient(#00a1f2,#00a1f2);">
    <div class="a-bar">
      <a href="javascript:history.back()" class="a-back"><i class="arr left"></i></a>
      <div class="a-name" style="color: white">用户注册</div>
      <div class="a-right">
        <!--<a href="/index.php/wap/passport-login.html" class="btn orange">登录</a>-->
      </div>
    </div>
  </header>
  <div class="full-padding">
    <form action="{:U('reg')}" method="post" class="form ajax-form" data-type="ajax">
      <div class="c-g" style="width: 100%;margin-bottom: 0;">
        <div class="k">
          <input type="text" name="username" maxlength="20" placeholder="请确认您的用户名" required="required" data-caution="用户名不能为空">
        </div>
      </div>
      <div class="notice"></div>
      <div class="c-g" style="margin: 14px 0 5px 0;">
        <!--<label for="" class="c-l">-->
          <!--<em class="f-red">*</em>手机号：-->
        <!--</label>-->
        <div class="k">
          <input type="text" id="phone" placeholder="输入手机号" name="phone" class="text a-account" required="required" maxlength="11" pattern="^1[34578]\d{9}$" autofocus data-caution="手机号不能为空">
        </div>
      </div>
      <div class="" style="margin: 14px 0 5px 0;float: left">
        <!--<label for="" class="c-l">-->
        <!--<em class="f-red">*</em>手机号：-->
        <!--</label>-->
        <div class="k" style="margin-left: 30px;">
          <a id="time_box" disabled style="background: #999;width:97px;display:none;" class="btn btn-send  ib-btn">获取验证码</a>
          <a href="javascript:;" id="verifyYz" style="background: #00a1f2;" class="btn btn-send  ib-btn">获取验证码</a>
        </div>
      </div>

      <div class="notice"></div>
      <div style="clear: both;height: 1px;"></div>
      <div class="c-g" style="width: 100%">
        <!--<label for="" class="c-l">-->
          <!--<em class="f-red">*</em>密码：-->
        <!--</label>-->
        <div class="k">
          <input type="text" name="phonecode" maxlength="20" placeholder="请输入短信验证码" required="required" pattern=".{6,20}" class="text" data-caution="短信验证码不能为空">
        </div>
      </div>
      <div class="notice"></div>
      <div style="clear: both;height: 1px;"></div>

      <div class="c-g" style="width: 100%">
        <!--<label for="" class="c-l">-->
        <!--<em class="f-red">*</em>密码：-->
        <!--</label>-->
        <div class="k">
          <input type="password" name="password" id="pwd1" maxlength="20" placeholder="请设置您的登录密码(6-20位)" required="required" pattern=".{6,20}" class="text password" data-caution="密码不能为空"></div>
      </div>
      <div class="notice"></div>
      <div style="clear: both;height: 1px;"></div>

      <div class="c-g" style="width: 100%;margin-bottom: 0;">
        <div class="k">
          <input type="password" name="repassword" id="pwd2" maxlength="20" placeholder="请确认您的登录密码" required="required" pattern=".{6,20}" class="text repassword" data-caution="确认密码不能为空">
        </div>
      </div>
      <div class="notice"></div>


            <div style="clear: both;height: 1px;"></div>

      <div class="c-g-c" style="text-align: center;">
        <input type="checkbox" name="license" id="license" checked="checked" style="display: none;">
        <label for="license" style="text-decoration:blink;">
          <a href="javascript:;" class="license lnk">注册账号即便是遵守《三鑫照明公司 服务条款》</a>        </label>
      </div>
      <div class="btn-bar">
        <button type="submit" class="btn " style="background: #00a1f2;border-radius: 5px;height: 35px;" rel="_request">确定</button>
      </div>
    </form>
  </div>
</div>
<script>
  //发送短信验证码
  $('#verifyYz').click(function () {
    var phone = $('#phone').val();
    if(phone == ''){
      return false;
    }
    $.ajax({
      url:"{:U('checkPhone')}",
      data:{'phone':phone},
      type:'post',
      success:function (e) {
        if(e == 1){ //未注册，发送短信验证码
          $.ajax({
            url:"{:U('sendCode')}",
            data:{'phone':phone},
            type:'post',
            success:function (e) {
              if(e == '成功'){
                var h, timerC = 60;
                function sendVerify(){
                  $("#verifyYz").text("发送验证码").hide();
                  $("#time_box").text("60 s后可重发").show();
                  if (timerC === 0) {
                    clearTimeout(h);
                    timerC = 10;
                    $("#verifyYz").show();
                    $("#time_box").hide();
                  }
                  $("#time_box").text(timerC + " s后可重发");
                  timerC--;
                }

                h = setInterval(sendVerify, 1000)
              }else{
                alert('短信发送失败')
              }
            }
          })
        }else{
          alert('该手机号已经注册');
        }
      }
    })

  })
</script>
</body>
</html>